<template>
  <div>
    <x-header id="header" :left-options="{backText: ''}">修改密码</x-header>
    <div class="main-header">
      <div class="weui-cells_form">
        <group gutter="0">
          <!--<x-input placeholder="请输入手机号码" class="input"  mask="99999999999" is-type="china-mobile"  :max="11" >-->
            <!--<div class="input-label" slot="label">手机号码</div>-->
          <!--</x-input>-->
          <!--<x-input placeholder="请输入验证码" :show-clear="false" class="input" mask="999999"  :max="6">-->
            <!--<div class="input-label" slot="label">验证码</div>-->
            <!--<x-button class="verification" plain slot="right" type="primary" mini>获取验证码</x-button>-->
          <!--</x-input>-->
          <x-input placeholder="请输入登录密码" class="input" type="password"  v-model="pwd1">
            <div class="input-label" slot="label">登录密码</div>
          </x-input>
          <x-input placeholder="请输入重复密码" class="input" type="password" v-model="pwd2">
            <div class="input-label" slot="label">重复密码</div>
          </x-input>
        </group>
      </div>
      <div class="save">
        <x-button class="save-button" @click.native="editPasswordHandle">确认</x-button>
      </div>
    </div>
  </div>
</template>

<script>
import { editPassword } from '@/api/user'
export default {
  name: 'password',
  components: {
  },
  data () {
    return {
      pwd1: '',
      pwd2: ''
    }
  },
  methods: {
    editPasswordHandle() {
      if (this.pwd1.length < 6) {
        this.$vux.toast.show({
          text: '密码密码过短',
          type: 'cancel'
        })
        return
      } else if (this.pwd1 !== this.pwd2) {
        this.$vux.toast.show({
          text: '密码不一致',
          type: 'cancel'
        })
        return
      } else {
        editPassword({cid:this.globalData.cid,password:this.pwd1}).then(() => {
          this.$vux.toast.show({
            text: '修改成功',
            type: 'success'
          })
          setTimeout(() => {
            this.$router.back(-1)
          },1500)
        })
      }
    }
  }
}
</script>

<style scoped>
.verification {
  font-size: 14px;
  color: #4A90E2;
  border: none;
  padding: 0;
}
</style>
